<!DOCTYPE html>
<html>
  
  <head>
    <meta charset="UTF-8">
    <title>添加二手房</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
    <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
    <link rel="stylesheet" href="/backstage/css/font.css">
    <link rel="stylesheet" href="/backstage/css/xadmin.css">
      <link rel="stylesheet" href="/backstage/css/add_house.css?v=1">
      <script type="text/javascript" src="/js/jquery.js"></script>
      <script type="text/javascript" src="/js/vue.js"></script>
      <script type="text/javascript" src="/backstage/lib/layui/layui.js" charset="utf-8"></script>
      <script type="text/javascript" src="/backstage/js/xadmin.js?v=1"></script>
      <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--&lt;!&ndash;[if lt IE 9]>-->
      <!--<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>-->
      <!--<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>-->
    <!--<![endif]&ndash;&gt;-->
  </head>
  
  <body >

    <div class="x-body" >

        <form action="" method="post" class="layui-form layui-form-pane">
            <div class="layui-form-item">
                <label for="name" class="layui-form-label">
                    <span class="x-red">*</span>楼盘标题
                </label>
                <div class="layui-input-block">
                    <input type="text" id="title" name="title" maxlength="50" lay-verify="required"
                    autocomplete="off" class="layui-input" value="{$seller['uptown']}">
                </div>
            </div>

            <div id="main">
                <div class="layui-form-item">
                    <label for="name" class="layui-form-label">
                        <span class="x-red">*</span>缩略图
                    </label>
                    <div class="layui-input-inline">
                        <input type="button" id="thumb_img"  @click="showImgList('thumb_img',1)"  value="选择图片（单选）" class="self-btn" >
                        <img :src="imgPath+thumb_img" style="width:190px;margin:0 0 10px 20px;" alt="">
                    </div>
                </div>

                <div class="layui-form-item">
                    <label for="name" class="layui-form-label">
                        <span class="x-red">*</span>轮播展示图
                    </label>
                    <div class="layui-input-block" >
                        <input type="button" id="viewpager"  @click="showImgList('returnImgList',2)" value="选择图片（多选）" lay-verify="required"
                               autocomplete="off" class="self-btn">

                        <img  v-for="(item,index) in returnImgList" :src="imgPath+item" style="max-width:150px;margin:10px 10px 10px 20px;" alt="">

                    </div>
                </div>
                <div class="layui-form-item">
                    <label for="name" class="layui-form-label">
                        房本备件
                    </label>
                    <div class="layui-input-inline">
                        <input type="button" id="house_cert"  @click="showImgList('house_cert',1)"  value="选择图片（单选）" class="self-btn" >
                        <img :src="imgPath+house_cert" style="width:190px;margin:0 0 10px 20px;" alt="">
                    </div>
                </div>

            </div>
            <div class="layui-form-item">
                <label for="name" class="layui-form-label">
                    选择标签
                </label>
                <div class="layui-input-block">
                    {foreach name='labels' item='row' index='index'}
                    <input name='labels[]' lay-skin="primary" type="checkbox" title="{$row['tag_name']}" value="{$row['id']}">
                    {/foreach}
                </div>
            </div>

            <div class="layui-form-item">
                <label for="name" class="layui-form-label">
                    <span class="x-red">*</span>总面积
                </label>
                <div class="layui-input-inline">
                    <input type="number" id="min_area" name="total_area" placeholder="" lay-verify="required"
                           autocomplete="off" class="layui-input">
                </div>
                <p style="float: left;margin:10px 5px 0 0px;">m²</p>

            </div>

            <div class="layui-form-item">
                <label for="name" class="layui-form-label">
                    <span class="x-red">*</span>套内面积
                </label>
                <div class="layui-input-inline">
                    <input type="number" id="usable_area" name="usable_area" placeholder="" lay-verify="required"
                           autocomplete="off" class="layui-input">
                </div>
                <p style="float: left;margin:10px 5px 0 0px;">m²</p>

            </div>
            <div class="layui-form-item">
                <label for="name" class="layui-form-label">
                    <span class="x-red">*</span>总售价
                </label>
                <div class="layui-input-inline">
                    <input type="number" id="total_price" name="total_price" required="" lay-verify="required"
                           autocomplete="off" class="layui-input" value="{$seller['total_price']}">
                </div>
                <div class="layui-input-inline">万</div>
            </div>
            <div class="layui-form-item">
                <label for="name" class="layui-form-label">
                    <span class="x-red">*</span>均价
                </label>
                <div class="layui-input-inline">
                    <input type="number" id="unit_price" name="unit_price" required="" lay-verify="required"
                           autocomplete="off" class="layui-input">
                </div>
                <div class="layui-input-inline">元</div>

            </div>

            <div class="layui-form-item">
                <label for="name" class="layui-form-label">
                    <span class="x-red">*</span> 选择朝向
                </label>
                <div class="layui-input-inline">
                    <select name="direction">
                        {foreach name="aspect" item="row"}
                        <option value="{$row['aspect_id']}">{$row['aspect_name']}</option>
                        {/foreach}
                    </select>
                </div>
            </div>
            <div class="layui-form-item">

                <label for="name" class="layui-form-label">
                    <span class="x-red">*</span>楼层类型
                </label>

                <div class="layui-input-block">
                    <input type="radio" name="floor_type" value="1" checked="checked" title="低层" >
                    <input type="radio" name="floor_type" value="2" title="中层" >
                    <input type="radio" name="floor_type" value="3" title="高层" >
                </div>

            </div>
            <div class="layui-form-item">
                <label for="name" class="layui-form-label">
                    <span class="x-red">*</span>总楼层
                </label>
                <div class="layui-input-inline">
                    <input type="number" id="floors" name="floors" required="" lay-verify="required"
                           autocomplete="off" class="layui-input">
                </div>
            </div>



            <div class="layui-form-item">
                <label for="name" class="layui-form-label">
                    <span class="x-red">*</span>选择坐标
                </label>
                <div class="layui-input-block" >
                    <!--<iframe src="" frameborder="0"></iframe>-->
                    {include file="common/baidu_map"}
                </div>

            </div>


            <div class="layui-form-item">
                <label for="name" class="layui-form-label">
                    <span class="x-red">*</span>坐标
                </label>
                <div class="layui-input-inline">
                    <input type="text" id="lng" name="lng"  placeholder="经度" readonly='readonly'
                            class="layui-input">
                </div>
                <div class="layui-input-inline">
                    <input type="text" id="lat" name="lat"  placeholder="纬度"  readonly='readonly'
                            class="layui-input">
                </div>
            </div>

            <div class="layui-form-item">
                <label for="name" class="layui-form-label">
                    <span class="x-red">*</span>房源地址
                </label>
                <div class="layui-input-block">
                    <input type="text" id="address" name="address" maxlength="200" required="" lay-verify="required"
                           autocomplete="off" class="layui-input" value="{$seller['address']}">
                </div>
            </div>
            <div class="layui-form-item">
                <label for="name" class="layui-form-label">
                    <span class="x-red">*</span>小区名称
                </label>
                <div class="layui-input-inline">
                    <input type="text" id="uptown" name="uptown" required="" maxlength="30" lay-verify="required"
                           autocomplete="off" class="layui-input" value="{$seller['uptown']}">
                </div>
            </div>

            <div class="layui-form-item">
                <label for="name" class="layui-form-label">
                    <span class="x-red">*</span>房屋年限
                </label>
                <div class="layui-input-inline">
                    <input type="number" id="durable_years" name="durable_years" required="" lay-verify="required"
                           autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label for="name" class="layui-form-label">
                    <span class="x-red">*</span>土地年限
                </label>
                <div class="layui-input-inline">
                    <input type="number" id="soil_years" name="soil_years" required="" lay-verify="required"
                           autocomplete="off" class="layui-input">
                </div>
            </div>

            <div class="layui-form-item">
                <label for="name" class="layui-form-label">
                    <span class="x-red">*</span>房屋预算
                </label>
                <div class="layui-input-block">
                    <input type="text" id="budget" name="budget" maxlength="50" required="" lay-verify="required"
                           autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label for="name" class="layui-form-label">
                    <span class="x-red">*</span>户型结构
                </label>
                <div class="layui-input-block">
                    <input type="text" id="structure" name="structure" maxlength="32" required="" lay-verify="required"
                           autocomplete="off" class="layui-input">
                </div>
            </div>

            <div class="layui-form-item">
                <label for="name" class="layui-form-label">
                    <span class="x-red">*</span>梯户比例
                </label>
                <p style="float: left;margin:10px 5px 0 20px;">
                    一梯
                </p>
                <div class="layui-input-inline">

                    <input type="number" id="floor_ratio" name="floor_ratio"  required="" lay-verify="required"
                           autocomplete="off" class="layui-input">
                </div>
                <p style="float: left;margin:10px 15px 0 0;">
                    户
                </p>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label"> <span class="x-red">*</span>供暖方式</label>
                <div class="layui-input-block">

                    {foreach  name="heating" item="row" index='index'}
                    <input type="radio" name="heating" value="{$index}" {$index==1?"checked='checked'":''} title="{$row}" >
                    {/foreach}
                </div>
            </div>

            <div class="layui-form-item">
                <label for="name" class="layui-form-label">
                    <span class="x-red">*</span> 交易权属
                </label>
                <div class="layui-input-inline">
                    <select name="transaction_type">
                        {foreach name="transaction_types" item="row" index='index'}
                        <option value="{$index}">{$row}</option>
                        {/foreach}
                    </select>
                </div>
            </div>

            <div class="layui-form-item">
                <label for="name" class="layui-form-label">
                    <span class="x-red">*</span> 产权所属
                </label>
                <div class="layui-input-inline">
                    <select name="property_right_type">
                        {foreach name="property_right_types" item="row" index='index'}
                        <option value="{$index}">{$row}</option>
                        {/foreach}
                    </select>
                </div>
            </div>

            <div class="layui-form-item">
                <label for="name" class="layui-form-label">
                    <span class="x-red"></span>抵押信息
                </label>
                <div class="layui-input-block">
                    <input type="text" id="pledge" name="pledge" maxlength="32"
                           autocomplete="off" class="layui-input">
                </div>

            </div>

            <div class="layui-form-item">
                <label for="name" class="layui-form-label">
                    <span class="x-red">*</span>年代
                </label>
                <div class="layui-input-block">
                    <input type="number" id="time" name="time"
                           autocomplete="off" class="layui-input">
                </div>

            </div>

            <div class="layui-form-item">
                <label for="name" class="layui-form-label">
                    <span class="x-red">*</span>户型
                </label>
                <div class="layui-input-inline">
                    <input type="number" id="room_num" name="room_num"
                           autocomplete="off" class="layui-input">

                </div>
                <p style="float: left;margin:10px 15px 0 0;">房</p>
                <div class="layui-input-inline">

                <input type="number" id="lobby_num" name="lobby_num"
                       autocomplete="off" class="layui-input">
                </div>
                <p style="float: left;margin:10px 15px 0 0;">厅</p>

            </div>

            <input type="hidden"  name="area_id">






            <div class="layui-form-item">
                <label class="layui-form-label"> <span class="x-red">*</span>车位情况</label>
                <div class="layui-input-block">

                    {foreach  name="carport_types" item="row" index='index'}
                    <input type="radio" name="carport_type" value="{$index}" {$index==1?"checked='checked'":''} title="{$row}" >
                   {/foreach}
                </div>
            </div>



            <div class="layui-form-item">
                <label for="name" class="layui-form-label">
                    <span class="x-red">*</span> 装修情况
                </label>
                <div class="layui-input-inline">
                    <select name="fitment_case">
                        {foreach name="fitment_case" item="row" index='index'}
                        <option value="{$row['fitment_type']}">{$row['title']}</option>
                        {/foreach}
                    </select>
                </div>
            </div>

            <div class="layui-form-item">
                <label for="name" class="layui-form-label">
                    <span class="x-red">*</span> 房屋用途
                </label>
                <div class="layui-input-inline">
                    <select name="use_type">
                        {foreach name="purpose" item="row"}
                        <option value="{$row['prupose_id']}">{$row['title']}</option>
                        {/foreach}
                    </select>
                </div>
            </div>



            <div class="layui-form-item">
                <label for="name" class="layui-form-label">
                    <span class="x-red">*</span> 经纪人
                </label>
                <div class="layui-input-inline">
                    <select name="broker_id">

                        {foreach name="brokers" item="row"}
                        <option value="{$row['id']}">{$row['broker_name']}</option>
                        {/foreach}
                    </select>
                </div>
            </div>


            <div class="layui-form-item">
                <label for="name" class="layui-form-label">
                    <span class="x-red">*</span>状态
                </label>
                <div class="layui-input-block">

                    <input type="radio" name="off" value="1" checked="checked" title="上架" >
                    <input type="radio" name="off" value="2" title="下架" >

                </div>
            </div>

            <div class="layui-form-item layui-form-text">
                <label for="desc" class="layui-form-label">
                    详情介绍
                </label>
                <div class="layui-input-block">
                    <textarea placeholder="请输入内容" id="description" name="description" maxlength="500" class="layui-textarea"></textarea>
                </div>
            </div>
            <div class="layui-form-item">
            <button class="layui-btn" lay-submit="" lay-filter="add" type="button">确认新增</button>
          </div>


            <input type="hidden" name="seller_id" value="{$seller['id']}">
              <!--{:token()}-->
        </form>
    </div>
  </body>
  <!--<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=ZDue9gF4HfumIt5DcwU0INw1ODmRcV16"></script>-->
  <!--<script src="/backstage/js/baiduMap.js"></script>-->


  <script>

      layDate();
      layui.use(['form','layer'], function(){
          $ = layui.jquery;
        var form = layui.form
        ,layer = layui.layer;
      
        //监听提交
        form.on('submit(add)', function(data){

            console.log(data);

            var data = data.field;

            if(data.lng==''){
              msg('请重新选择坐标');return ;
            }


            if(data.floors<1){
              msg('总楼层不能少于1');return;
            }

            if(data.total_area<1 ){
               msg('面积不能少于1'); return;
            }


            if(data.unit_price<0 ){
                msg('均价不能为负数'); return;
            }
            if(data.total_price<0 ){
                msg('均价不能为负数'); return;
            }

            if(data.durable_years<0 ){
                msg('房屋年限不能为负数'); return;
            }

            if(data.soil_years<0 ){
                msg('土地年限不能少于1'); return;
            }
            if(data.floor_ratio<0 ){
                msg('梯户比例不能少于1'); return;
            }

            if(data.room_num<0  || data.lobby_num<1 ){
                msg('户型不能少于1'); return;
            }


            if(app.thumb_img==''){
                msg('请选择缩略图'); return;
            }

            var viewPage = app.returnImgList;

            if(viewPage.length==0){
                msg('请选择轮播展示图'); return;
            }


            data.thumb_img = app.thumb_img;
            data.viewpager = viewPage;
            data.house_cert = app.house_cert;


            console.log(data,'save');


            $.post('{:config("template.root_path")}/resoldhouse/save',data,function(res){
              if(res.code=='200'){
                    // 获得frame索引
//                   var index = parent.layer.getFrameIndex(window.name);
                  var index = parent.layer.index;

                   if(index){
                       //关闭当前frame
                       parent.layer.close(index);
                       parent.layer.msg("增加成功", {icon: 6,time:1500});
                       parent.app.getListData();
                       parent.app.page();
                   }else{
                       layer.msg("增加成功", {icon: 6,time:1500});
                       window.location.reload();
                   }

              }else{
                  layer.msg(res.msg, {icon: 5,time:1500});
              }
 
          },'json');
   
        });

      });


      function msg(text){
          layer.msg(text, {icon: 2,time:1500});

      }

      //获取选择的图片
      var app = new Vue({
        el:'#main',
        data: {
          imgPath:'{:config("api.oss_img_path")}',
          thumb_img:'',
          returnImg:'',
          house_cert:'',
          returnImgList:[],
          houseTypes:[],
          flag:'',
          houseTypeIndex:0
        },
        methods:{

          //处理从图片弹层传递过来的图片
          getImg:function(){

            console.log('flag',this.flag);
              switch (this.flag){
                case 'thumb_img':
                  this.thumb_img=this.returnImg;
                  break;
                case 'house_cert':
                      this.house_cert=this.returnImg;
                      break;
                case 'houseTypes':
                  this.houseTypes[this.houseTypeIndex].img = this.returnImg;
                  break;
              }
          },


          //添加户型
          addHouseType:function(){
            console.log(this.houseTypes);
            var type={img:'',fang:'',ting:'',wei:'',total_area:''};
            this.houseTypes.push(type);
          },


          //取消户型
          delHouseType:function(index){
            this.houseTypes.splice(index,1);
          },

          //弹出图片选择列表
          showImgList(flag,sel,index=0){


            this.houseTypeIndex=index;
            this.flag=flag;
            console.log(flag,sel);

            var selTitle = sel==1?'（单选）':'（多选）';

            x_admin_show('选择图片'+selTitle,'{:config(\'template.root_path\')}/resource/image_folder'+'?sel='+sel);
          }



        },
        created: function () {

        }
      });


  </script>

</html>